<template>
  <div id="app-container">
    <u-page title="专柜合作条件呈报表">
      <el-descriptions class="frominfo" :model="form">
        <el-descriptions-item label="申请人员">{{ form.applicantnickname }}</el-descriptions-item>
        <el-descriptions-item label="表单编号">{{ form.code }}</el-descriptions-item>
        <el-descriptions-item label="申请时间">{{ form.applyTime }}</el-descriptions-item>
        <el-descriptions-item label="填表人员">{{ form.preparernickname }}</el-descriptions-item>
        <!--        <el-descriptions-item label="当前处理人"></el-descriptions-item>-->
      </el-descriptions>
      <el-form ref="contractform" :model="form" :rules="contractform" label-width="110px" label-position="left" size="mini">
        <div class="contractCheckBox">
          <el-form-item label="是否生成合同" prop="ifcontract">
            <el-radio-group v-model="form.ifcontract" :disabled="cansave">
              <el-radio label="是" />
              <el-radio label="否" />
            </el-radio-group>
          </el-form-item>
          <el-form-item v-if="form.ifcontract==='是'" label="用印顺序" prop="sequence">
            <el-radio-group v-model="form.sequence" :disabled="cansave">
              <el-radio label="对方先用印" />
              <el-radio label="我方先用印" />
            </el-radio-group>
          </el-form-item>
          <el-form-item v-if="form.ifcontract==='是'" label="印章类型" prop="sealtype">
            <el-radio-group v-model="form.sealtype" :disabled="cansave">
              <el-radio label="实物印章" />
              <el-radio label="电子印章" />
            </el-radio-group>
          </el-form-item>
          <el-form-item label="合同类型" prop="agreementtype">
            <el-radio-group v-model="form.agreementtype" :disabled="cansave" @change="hanleAgreementtypeChange">
              <el-radio label="新增" />
              <el-radio label="续签" />
            </el-radio-group>
          </el-form-item>
          <el-form-item label="呈报类型" prop="operationtype">
            <el-radio-group v-model="form.operationtype" :disabled="cansave" @change="hanleOperationtypetypeChange">
              <el-radio label="联营" />
              <el-radio label="租赁" />
              <el-radio label="餐饮" />
              <el-radio label="自营" />
              <el-radio label="线上联营" />
              <el-radio label="线上租赁" />
            </el-radio-group>
          </el-form-item>
        </div>
        <!--列表切换的选项卡-->
        <div id="contracttabs" class="demo_warp">
          <ul class="tab_tit">
            <li :class="choosetab===1?'active':''" @click="choosetab=1">1.合同基本信息</li>
            <li :class="choosetab===2?'active':''" @click="choosetab=2">2.合同扣款信息</li>
          </ul>
          <!-- neirong -->
          <div class="tab_con">
            <!--合同基本信息 -->
            <div v-show="choosetab===1" style="width: 99%;padding: 2px;font-size: 14px ">
              <table width="98%" class="linkeytableHT tableOne" data-sort="sortDisabled">
                <tbody>
                  <tr class="firstRow">
                    <td valign="middle" rowspan="1" colspan="1"><br></td>
                    <td valign="middle" style="-ms-word-break: break-all;">原合约信息</td>
                    <td valign="middle" style="-ms-word-break: break-all;">新合约信息</td>
                    <td valign="middle" rowspan="1" colspan="1">差异</td>
                  </tr>
                  <tr>
                    <td valign="middle" style="-ms-word-break: break-all;">合同号</td>
                    <td valign="middle" style="-ms-word-break: break-all;">
                      <input v-model="form.oldht.contractcode" size="mini" style="width:180px" :disabled="cansave">
                      <el-button size="mini" type="primary" style="margin-left: 5px" :disabled="cansave" @click="queryoldhtAndClone()">获取信息</el-button>
                    </td>
                    <td valign="middle" style="-ms-word-break: break-all;">
                      <input v-model="form.newht.contractcode" size="mini" style="width:180px" :disabled="cansave">
                    </td>
                    <td valign="middle" rowspan="1" colspan="1"><br></td>
                  </tr>
                  <tr>
                    <td valign="middle" style="-ms-word-break: break-all;">部门</td>
                    <td valign="middle"><input v-model="form.oldht.deptname" readonly="true" size="20" value="" :disabled="cansave"></td>
                    <td valign="middle" style="-ms-word-break: break-all;">
                      <el-select v-model="form.newht.deptid" placeholder="请选择部门" :disabled="cansave" @change="handleDeptId">
                        <el-option v-for="item in departments" :label="item.deptname" :value="item.deptid" />
                      </el-select>
                    </td>
                    <td valign="middle" rowspan="1" colspan="1"><br></td>
                  </tr>
                  <tr>
                    <td valign="middle" style="-ms-word-break: break-all;">厂编</td>
                    <td valign="middle"><input v-model="form.oldht.firmcode" readonly="true" size="20" value="" :disabled="cansave"></td>
                    <td valign="middle">
                      <input v-model="form.newht.firmcode" size="30" value="" :disabled="cansave" @change="getFirmbyfirmcode">
                      <el-button size="mini" type="primary" style="margin-left: 5px" :disabled="cansave" @click="handleFirmList()">厂商列表</el-button>
                      <!--                      <span style="padding-left:5px;font-size: small;color: #FF0000">测试使用：022065、020534、021982</span>-->
                      <span v-if="form.agreementtype==='续签'" style="padding-left:5px;font-size: small;color: #C03639">（可直接输入厂编，若不清楚厂编则点击厂商列表查询）</span>
                      <span v-if="form.agreementtype==='新增'" style="padding-left:5px;font-size: small;color: #C03639">（新签合同无需填写厂编，请从厂商列表中获取厂商）</span>
                    </td>
                    <td valign="middle" rowspan="1" colspan="1"><br></td>
                  </tr>
                  <tr>
                    <td valign="middle" style="-ms-word-break: break-all;">厂商名称</td>
                    <td valign="middle"><input v-model="form.oldht.firmname" readonly="true" size="50" value="" :disabled="cansave"></td>
                    <td valign="middle"><input v-model="form.newht.firmname" readonly="true" size="50" value="" :disabled="cansave">
                    </td>
                    <td valign="middle" rowspan="1" colspan="1"><br></td>
                  </tr>
                  <tr>
                    <td valign="middle" style="-ms-word-break: break-all;">柜位号</td>
                    <td valign="middle"><input v-model="form.oldht.zgcode" readonly="true" size="20" value="" :disabled="cansave"></td>
                    <td valign="middle">
                      <input v-model="form.newht.zgcode" size="30" :readonly="form.agreementtype==='续签'" :disabled="cansave">
                      <el-button v-if="form.agreementtype==='续签'" size="mini" type="primary" style="margin-left: 5px" :disabled="cansave" @click="handleZg()">选择专柜</el-button>
                      <span style="padding-left:5px;color: #C03639">*新建专柜无需填写专柜号，请直接填写专柜信息方便商友建档</span>
                    </td>
                    <td valign="middle" rowspan="1" colspan="1"><br></td>
                  </tr>
                  <tr>
                    <td valign="middle" style="-ms-word-break: break-all;">专柜名称</td>
                    <td valign="middle"><input v-model="form.oldht.zgname" :disabled="cansave" size="20" value=""></td>
                    <td valign="middle"><input v-model="form.newht.zgname" size="20" value="" :readonly="form.agreementtype==='续签'" :disabled="cansave"><span v-if="form.agreementtype==='续签'" style="padding-left:5px;color: #C03639">*若需要修改专柜名称或部类请重新选择专柜</span></td>
                    <!--                    <td valign="middle" v-if="form.agreementtype==='新增'"><input v-model="form.newht.zgname" size="20" value="" ><span style="padding-left:5px;color: #C03639">*新签合同无需填写专柜号，请直接填写专柜信息方便商友建档</span></td>-->
                    <td valign="middle" rowspan="1" colspan="1"><br></td>
                  </tr>
                  <tr>
                    <td valign="middle" style="-ms-word-break: break-all;">品牌</td>
                    <td valign="middle"><input v-model="form.oldht.brand" readonly="true" size="20" value="" :disabled="cansave"></td>
                    <td valign="middle"><input v-model="form.newht.brand" size="20" value="" :disabled="cansave"></td>
                    <td valign="middle" rowspan="1" colspan="1"><br></td>
                  </tr>
                  <tr>
                    <td valign="middle" style="-ms-word-break: break-all;">部类</td>
                    <td valign="middle"><input v-model="form.oldht.bl" readonly="true" size="20" value="" :disabled="cansave"></td>
                    <td valign="middle"><input v-model="form.newht.bl" size="20" value="" :disabled="cansave"></td>
                    <td valign="middle" rowspan="1" colspan="1"><br></td>
                  </tr>
                  <tr>
                    <td valign="middle" style="-ms-word-break: break-all;">楼层</td>
                    <td valign="middle"><input v-model="form.oldht.floor" readonly="true" size="20" value="" :disabled="cansave"></td>
                    <td valign="middle">
                      <el-select v-model="form.newht.floor" placeholder="请选择楼层" :disabled="cansave">
                        <el-option v-for="item in floors" :label="item.code" :value="item.name" />
                      </el-select>
                    </td>
                    <td valign="middle" rowspan="1" colspan="1"><br></td>
                  </tr>
                  <tr>
                    <td valign="middle" style="-ms-word-break: break-all;">面积</td>
                    <td valign="middle"><input v-model="form.oldht.area" readonly="true" size="20" value="" :disabled="cansave"></td>
                    <td valign="middle" style="-ms-word-break: break-all;"><input v-model="form.newht.area" size="20" value="0" :disabled="cansave" @change="changearea">㎡</td>
                    <td valign="middle" rowspan="1" colspan="1">
                      <span id="mjcy" class="ue_t" name="mjcy" type="xfield">{{ form.newht.area-form.oldht.area }}
                      </span>
                    </td>
                  </tr>
                  <tr>
                    <td valign="middle" style="-ms-word-break: break-all;">合约期限</td>
                    <td valign="middle" style="-ms-word-break: break-all;">
                      <input v-model="form.oldht.startdate" class="easyui-datebox" size="20" readonly="true" :disabled="cansave" data-options="formatter:formatterDate,editable:false" exttype="date">--<input v-model="form.oldht.enddate" class="easyui-datebox" size="20" readonly="true" data-options="formatter:formatterDate,editable:false" exttype="date" :disabled="cansave"></td>
                    <td valign="middle" style="-ms-word-break: break-all;"><el-date-picker v-model="form.newht.startdate" style="width: 130px" value-format="yyyy-MM-dd" type="date" placeholder="选择日期" :disabled="cansave" @change="handleStartdateChanged()" />--<el-date-picker v-model="form.newht.enddate" style="width: 130px" value-format="yyyy-MM-dd" type="date" placeholder="选择日期" :disabled="cansave" @change="handleEnddateChanged()" /></td>
                    <td valign="middle" rowspan="1" colspan="1"><br></td>
                  </tr>
                  <tr>
                    <td valign="middle" style="-ms-word-break: break-all;">期限分解</td>
                    <td valign="middle" style="-ms-word-break: break-all;" />
                    <td valign="middle" style="-ms-word-break: break-all;">
                      <el-table v-if="form.datedetails.length!=0" :data="form.datedetails" border size="small" :header-cell-style="{backgroundColor: '#fafafa'}" :show-header="false">
                        <el-table-column prop="title" label="title" width="180" />
                        <el-table-column prop="startday" label="startday" width="180" />
                        <el-table-column prop="endday" label="endday" width="180">
                          <template slot-scope="scope">
                            <el-date-picker v-model="scope.row.endday" type="month" format="yyyy-MM-dd" value-format="yyyy-MM-dd" :disabled="scope.$index!==0||form.datedetails.length===1||cansave" @change="updateEndDate(scope.row, scope.$index)" />
                          </template>
                        </el-table-column>
                      </el-table>
                    </td>
                    <td valign="middle" rowspan="1" colspan="1"><br></td>
                  </tr>
                  <tr v-if="form.operationtype!=='自营'">
                    <td valign="middle" style="-ms-word-break: break-all;">结算方式</td>
                    <td valign="middle" style="-ms-word-break: break-all;" />
                    <td valign="middle" style="-ms-word-break: break-all;">
                      <el-select v-model="form.newht.jsfs" placeholder="请选择结算方式" :disabled="cansave" @change="hdlJsfs">
                        <el-option v-for="item in jsfsList" :label="item.jsfs" :value="item.jsfsid" />
                      </el-select>
                    </td>
                    <td valign="middle" rowspan="1" colspan="1"><br></td>
                  </tr>
                  <tr v-if="form.operationtype==='租赁'||form.operationtype==='餐饮'||form.operationtype==='线上租赁'">
                    <td valign="middle" style="-ms-word-break: break-all;">收益方式</td>
                    <td valign="middle" style="-ms-word-break: break-all;" />
                    <td valign="middle" style="-ms-word-break: break-all;">
                      <el-radio-group v-model="form.newht.syfs" :disabled="cansave" @change="handleSyfs">
                        <el-radio v-if="form.newht.jsfs!==2" label="0">抽成租金</el-radio>
                        <el-radio v-if="form.newht.jsfs===2" label="1">固定租金</el-radio>
                        <el-radio v-if="form.newht.jsfs===2" label="2" :disabled="true">两者取高</el-radio>
                        <el-radio v-if="form.newht.jsfs===2" label="3">两者取高新（超出部分计入系统服务费）</el-radio>
                      </el-radio-group>
                    </td>
                  </tr>
                  <tr v-if="form.newht.jsfs===1&&form.operationtype!=='自营'&&form.operationtype!=='餐饮'">
                    <td valign="middle" style="-ms-word-break: break-all;">是否分商品核算目标</td>
                    <td valign="middle" />
                    <td valign="middle">
                      <el-radio-group v-model="form.newht.ifhsbd" :disabled="cansave" @change="hdlIfhsbd">
                        <el-radio label="是" />
                        <el-radio label="否" />
                      </el-radio-group>
                    </td>
                    <td valign="middle" rowspan="1" colspan="1"><br></td>
                  </tr>
                  <tr v-if="form.operationtype!=='自营'" id="bdqsfstr">
                    <td valign="middle" style="-ms-word-break: break-all;">目标清算方式</td>
                    <td valign="middle" style="-ms-word-break: break-all;" />
                    <td valign="middle" style="-ms-word-break: break-all;"><input v-model="form.newht.bdqsfs" size="40" disabled="false"></td>
                    <td valign="middle" rowspan="1" colspan="1"><br></td>
                  </tr>
                  <!--                <tr v-if="form.newht.jsfs!==0">
                  <td valign="middle" style="-ms-word-break: break-all;">营业目标(元)</td>
                  <td valign="middle"><input v-model="form.oldht.yymb" readonly="true" size="20" value="" :disabled="cansave"></td>
                  <td valign="middle" style="-ms-word-break: break-all;"><input v-model="form.newht.yymb" size="20" value="0" :disabled="cansave"></td>
                  <td valign="middle" rowspan="1" colspan="1">
                      <span id="mjcy" class="ue_t" name="mjcy" type="xfield">{{ form.newht.yymb-form.oldht.yymb }}
                      </span>
                  </td>
                </tr>-->
                  <tr v-if="showSalesTarget">
                    <td valign="middle" style="-ms-word-break: break-all;">目标营业销售额(元)</td>
                    <td valign="middle"><input v-model="form.oldht.yyxse" readonly="true" size="20" value="" :disabled="cansave"></td>
                    <td valign="middle" style="-ms-word-break: break-all;"><input v-model="form.newht.yyxse" size="20" value="0" :disabled="cansave"></td>
                    <td valign="middle" rowspan="1" colspan="1">
                      <span id="mjcy" class="ue_t" name="mjcy" type="xfield">{{ form.newht.yyxse-form.oldht.yyxse }}
                      </span>
                    </td>
                  </tr>
                  <tr v-if="showProfitTarget">
                    <td valign="middle" style="-ms-word-break: break-all;">目标营业毛利额(元)</td>
                    <td valign="middle"><input v-model="form.oldht.yymle" readonly="true" size="20" value="" :disabled="cansave"></td>
                    <td valign="middle" style="-ms-word-break: break-all;"><input v-model="form.newht.yymle" size="20" value="0" :disabled="cansave"></td>
                    <td valign="middle" rowspan="1" colspan="1">
                      <span id="mjcy" class="ue_t" name="mjcy" type="xfield">{{ form.newht.yymle-form.oldht.yymle }}
                      </span>
                    </td>
                  </tr>
                  <tr v-if="form.operationtype!=='自营'">
                    <td valign="middle" rowspan="1" colspan="1">收益</td>
                    <td valign="middle" rowspan="1" colspan="1" />
                    <td valign="middle" rowspan="1" colspan="2">
                      <template>
                        <el-table :data="form.ccdetails" :border="true" width="900px">
                          <el-table-column v-if="form.operationtype !=='餐饮'" key="pl" label="品类" prop="pl" width="125">
                            <template slot-scope="scope">
                              <el-input v-model="scope.row.pl" :disabled="cansave" @change="changeccpl(scope.row,scope.$index)" />
                            </template>
                          </el-table-column>
                          <el-table-column key="startDate" label="开始日期" prop="startDate" width="160">
                            <template slot-scope="scope">
                              <el-date-picker v-model="scope.row.startDay" style="width: 130px" value-format="yyyy-MM-dd" type="date" placeholder="选择日期" :disabled="true" />
                            </template>
                          </el-table-column>
                          <el-table-column key="endDate" label="结束日期" prop="endDate" width="160">
                            <template slot-scope="scope">
                              <el-date-picker v-model="scope.row.endDay" style="width: 130px" value-format="yyyy-MM-dd" type="date" placeholder="选择日期" :disabled="cansave" @change="changeccendday(scope.row)" />
                            </template>
                          </el-table-column>
                          <el-table-column key="cc" :key="form.operationtype" :label="labelMap[form.operationtype]" prop="cc" width="220">
                            <template slot-scope="scope">
                              <div style="display: flex; align-items: center">
                                <el-input
                                  v-model="scope.row.cc"
                                  type="number"
                                  :precision="2"
                                  :step="0.01"
                                  :min="0"
                                  size="small"
                                  :placeholder="['联营', '线上联营'].includes(form.operationtype)
                                    ? ''
                                    : form.newht.syfs === '0'
                                      ? '填写比例，单位为%'
                                      : '填写租金金额，单位为元'"
                                  :disabled="cansave"
                                  @input="handleCCInput(scope.row)"
                                />
                                <!--                                <el-tooltip-->
                                <!--                                  v-if="form.operationtype === '联营'||form.operationtype !== '线上联营'"-->
                                <!--                                  effect="dark"-->
                                <!--                                  :content="textMap[form.newht.syfs]"-->
                                <!--                                  placement="top"-->
                                <!--                                >-->
                                <!--                                  <i class="el-icon-warning" style="color: red; margin-left: 5px; cursor: pointer" />-->
                                <!--                                </el-tooltip>-->
                              </div>
                            </template>
                          </el-table-column>
                          <el-table-column v-if="form.operationtype !== '联营'&&form.operationtype !== '线上联营'" key="income" label="总收益(%)" prop="income" width="110">
                            <template slot-scope="scope">
                              <el-input v-model="scope.row.income" type="number" :min="0" size="small" :disabled="cansave" />
                            </template>
                          </el-table-column>
                          <el-table-column v-if="form.newht.jsfs >2" key="mbxx" label="目标销售" prop="mbxx" width="110">
                            <template slot-scope="scope">
                              <el-input v-model="scope.row.mbxx" type="number" :min="0" size="small" :disabled="cansave" />
                            </template>
                          </el-table-column>
                          <el-table-column v-if="form.newht.jsfs >2" key="cmbzj" label="超目标租金" prop="cmbzj" width="110">
                            <template slot-scope="scope">
                              <el-input v-model="scope.row.cmbzj" type="number" :min="0" size="small" :disabled="cansave" />
                            </template>
                          </el-table-column>
                          <el-table-column v-if="form.newht.jsfs >2" key="cmbcxfwf" label="超目标场地促销服务费" prop="cmbcdcxfwf" width="110">
                            <template slot-scope="scope">
                              <el-input v-model="scope.row.cmbcxfwf" type="number" :min="0" size="small" :disabled="cansave" />
                            </template>
                          </el-table-column>
                          <el-table-column v-if="form.newht.jsfs >2" key="cmbwhfwf" label="超目标场地维护服务费" prop="cmbcdwhfwf" width="110">
                            <template slot-scope="scope">
                              <el-input v-model="scope.row.cmbwhfwf" type="number" :min="0" size="small" :disabled="cansave" />
                            </template>
                          </el-table-column>
                          <el-table-column key="bz" label="备注" prop="bz" width="110">
                            <template slot-scope="scope">
                              <el-input v-model="scope.row.bz" size="small" :disabled="cansave" />
                            </template>
                          </el-table-column>
                          <el-table-column key="bdmle" label="日均目标毛利额" prop="bdmle" width="120">
                            <template slot-scope="scope">
                              <el-input v-model="scope.row.bdmle" type="number" placeholder="" :min="0" :disabled="cansave" />
                            </template>
                          </el-table-column>
                          <el-table-column label="操作" width="auto">
                            <template slot-scope="scope">
                              <el-button size="mini" type="danger" plain :disabled="cansave" @click="delccdetails(scope.$index)">删除</el-button>
                            </template>
                          </el-table-column>
                        </el-table>
                        <el-button class="el-icon-circle-plus-outline" :disabled="cansave" @click="addccdetails" />
                        <el-button v-if="form.newht.jsfs!==0" type="primary" plain :disabled="cansave" @click="confirmccdetails">分解</el-button><span v-if="form.newht.jsfs!==0" style="font-size: small;color: #C03639;margin-left: 5px">*需要填写目标分解则填写好信息后点击生成分解表</span>
                      </template>
                    </td>
                  </tr>
                  <tr v-if="form.newht.jsfs >2">
                    <td valign="middle" style="-ms-word-break: break-all;">核算范围</td>
                    <td valign="middle" style="-ms-word-break: break-all;" />
                    <td valign="middle" style="-ms-word-break: break-all;">
                      <el-radio-group v-model="form.newht.hsrange" :disabled="cansave">
                        <el-radio label="全部销售" />
                        <el-radio label="超目标的销售" />
                      </el-radio-group>
                    </td>
                  </tr>
                  <tr v-if="showSalesTarget&&form.newht.yyxse>0">
                    <td valign="middle" rowspan="1" colspan="1">目标营业销售额月度分解</td>
                    <td valign="middle" rowspan="1" colspan="3">
                      <el-table :data="form.fjdata" max-height="500" show-summary :summary-method="getSummaries">
                        <el-table-column prop="hyyear" fixed label="合约年" align="center" />
                        <el-table-column prop="yearmonth" fixed label="年月" align="center" />
                        <el-table-column v-for="(column, colIndex) in form.fjcolumns" :key="colIndex" :prop="column.prop" :label="column.label" align="center">
                          <template slot-scope="scope">
                            <el-input v-model="scope.row[column.prop]" style="width: 100px" :disabled="cansave" @input="limitToTwoDecimals(scope.row,column.prop)" />
                          </template>
                        </el-table-column>
                        <el-table-column label="清算标记" prop="clearing" align="center">
                          <template slot-scope="scope">
                            <el-checkbox v-model="scope.row.clearing" :disabled="cansave" />
                          </template>
                        </el-table-column>
                      </el-table>
                    </td>
                  </tr>
                  <tr v-if="showProfitTarget&&form.newht.yymle>0">
                    <td valign="middle" rowspan="1" colspan="1">目标营业毛利额月度分解</td>
                    <td valign="middle" rowspan="1" colspan="3">
                      <el-table :data="form.fjdata" max-height="500" style="width: 90%" :fit="true" show-summary :summary-method="getSummaries">
                        <el-table-column prop="hyyear" fixed label="合约年" align="center" />
                        <el-table-column prop="yearmonth" fixed label="年月" align="center" />
                        <el-table-column v-for="(column, colIndex) in form.fjcolumns" :key="colIndex" :prop="column.prop" :label="column.label" align="center">
                          <template slot-scope="scope">
                            <el-input v-model="scope.row[column.prop]" style="width: 100px" :disabled="cansave" @input="limitToTwoDecimals(scope.row,column.prop)" />
                          </template>
                        </el-table-column>
                        <el-table-column label="清算标记" prop="clearing" align="center">
                          <template slot-scope="scope">
                            <el-checkbox v-model="scope.row.clearing" :disabled="cansave" />
                          </template>
                        </el-table-column>
                      </el-table>
                    </td>
                  </tr>
                  <tr>
                    <td valign="middle" rowspan="1" colspan="1">抽成说明</td>
                    <td valign="middle" rowspan="1" colspan="1"><textarea v-model="form.oldht.ccexplain" style="width: 80%; height: 150px;" :disabled="cansave" /></td>
                    <td valign="middle" rowspan="1" colspan="2"><textarea v-model="form.newht.ccexplain" style="width: 80%; height: 150px;" :disabled="cansave" /></td>
                  </tr>
                  <tr>
                    <td valign="middle" style="-ms-word-break: break-all;">结款方式</td>
                    <td valign="middle" style="-ms-word-break: break-all;" />
                    <td valign="middle" style="-ms-word-break: break-all;">
                      <el-select v-model="form.newht.jkfs" placeholder="请选择结款方式" :disabled="cansave" @change="handleJkfs">
                        <el-option v-if="form.newht.hsfs===1" :label="'账期付款'" :value="5" />
                        <el-option :label="'结算付款'" :value="0" />
                        <el-option :label="'结算提现'" :value="1" />
                        <el-option v-if="form.newht.hsfs===5" :label="'周期提现'" :value="2" />
                        <el-option v-if="form.newht.hsfs===5" :label="'自收银'" :value="3" />
                      </el-select>
                    </td>
                    <td valign="middle" rowspan="1" colspan="1"><br></td>
                  </tr>
                  <tr>
                    <td valign="middle" style="-ms-word-break: break-all;">账期</td>
                    <td valign="middle" style="-ms-word-break: break-all;"><input v-model="form.oldht.zqname" size="20" value="" readonly="true"></td>
                    <td valign="middle" style="-ms-word-break: break-all;">
                      <el-select v-model="form.newht.zqid" placeholder="请选择账期" :disabled="cansave" @change="handleZqId">
                        <el-option v-if="form.newht.jkfs<2" :label="'月结'" :value="1" />
                        <el-option v-if="form.newht.jkfs<2&&form.newht.hsfs===0" :label="'其他'" :value="5" />
                        <el-option v-if="form.newht.jkfs===1" :label="'半月结'" :value="2" />
                        <el-option v-if="form.newht.jkfs===2" :label="'营业日'" :value="3" />
                        <el-option v-if="form.newht.jkfs===3" :label="'/'" :value="4" />
                      </el-select>
                      <span v-if="form.newht.zqid>2" id="zqsmDiv"> 账期说明：<input v-model="form.newht.zqsm" size="30" value="" :disabled="cansave">
                      </span>
                    </td>
                    <td valign="middle" rowspan="1" colspan="1"><br></td>
                  </tr>
                  <tr>
                    <td valign="middle" style="-ms-word-break: break-all;">票期天数</td>
                    <td valign="middle" style="-ms-word-break: break-all;"><input v-model="form.oldht.pqts" size="20" value="" readonly="true"></td>
                    <td valign="middle" style="-ms-word-break: break-all;">
                      <el-select v-if="form.newht.zqid < 3" v-model="form.newht.pqts" placeholder="请选择票期天数" :disabled="cansave" @change="handlePqts">
                        <el-option v-for="item in pqList" :label="item" :value="item" />
                      </el-select>
                      <div v-if="form.newht.zqid === 3||form.newht.zqid === 5">
                        <input v-model="form.newht.pqts" :disabled="cansave" size="20">
                        <span style="font-size: small;color: #C03639;margin-left: 5px">*账期选择”营业日“或“其他”时，票期自行填写不小于3的整数</span>
                      </div>
                    </td>
                    <td valign="middle" rowspan="1" colspan="1"><br></td>
                  </tr>
                  <tr v-if="form.operationtype!=='自营'">
                    <td valign="middle" rowspan="1" colspan="1">合同费用最后缴款日</td>
                    <td valign="middle" rowspan="1" colspan="1"><span style="color: darkred;padding-left: 5px"> {{ form.oldht.znjsqfs }}</span></td>
                    <td valign="middle" rowspan="1" colspan="2">
                      <span style="color: darkred;padding-left: 5px"> {{ form.newht.znjsqfs }}</span>
                    </td>
                  </tr>
                  <tr>
                    <td valign="middle" rowspan="1" colspan="1">收银方式</td>
                    <td valign="middle" rowspan="1" colspan="1"><input v-model="form.oldht.zffs" size="20" :disabled="cansave"></td>
                    <td valign="middle" rowspan="1" colspan="2"><input v-model="form.newht.zffs" size="20" :disabled="cansave||form.newht.zqid<3"></td>
                  </tr>
                  <tr v-if="form.newht.zffs==='自收银'&&form.operationtype!=='自营'">
                    <td valign="middle" style="-ms-word-break: break-all;">是否接受储值卡</td>
                    <td valign="middle" style="-ms-word-break: break-all;" />
                    <td valign="middle">
                      <el-radio-group v-model="form.newht.ifczk" :disabled="cansave">
                        <el-radio label="是" />
                        <el-radio label="否" />
                      </el-radio-group>
                    </td>
                    <td valign="middle" rowspan="1" colspan="1"><br></td>
                  </tr>
                  <tr v-if="form.newht.ifczk === '是'&&form.operationtype!=='自营'">
                    <td valign="middle" style="-ms-word-break: break-all;">储值卡账款结算</td>
                    <td valign="middle" style="-ms-word-break: break-all;" />
                    <td valign="middle">
                      <el-radio-group v-model="form.newht.czkzkjs" :disabled="cansave" @change="handleCzkzkjs">
                        <el-radio label="1">月结交票付款</el-radio>
                        <el-radio label="2">乙方于营业日后第(<input v-if="form.newht.czkzkjs === '2'" v-model="form.newht.czkzkjsday" type="number" style="width: 50px" max="10" :disabled="cansave">)自助提款 </el-radio>
                        <el-radio label="3">乙方于每月第(<input v-if="form.newht.czkzkjs === '3'" v-model="form.newht.czkzkjsday" type="number" style="width: 50px" max="10" :disabled="cansave">天自助提款（提以前月度款）</el-radio>
                      </el-radio-group>
                    </td>
                    <td valign="middle" rowspan="1" colspan="1"><br></td>
                  </tr>
                  <tr v-if="form.newht.zqid!==4">
                    <td valign="middle" rowspan="1" colspan="1">交票期限</td>
                    <td valign="middle" rowspan="1" colspan="1"><input v-model="form.oldht.jpqx" size="20" :disabled="cansave"></td>
                    <td valign="middle" rowspan="1" colspan="2"><input v-model="form.newht.jpqx" size="20" :disabled="cansave||form.newht.zqid<3"></td>
                  </tr>
                  <tr v-if="form.operationtype!=='自营'">
                    <td valign="middle" rowspan="1" colspan="1">解约费用</td>
                    <td valign="middle" rowspan="1" colspan="1">目标营业销售额提成<input value="300" size="5" :disabled="cansave" readonly="true">%</td>
                    <td valign="middle" rowspan="1" colspan="2">目标营业销售额提成<input v-model="form.newht.jyfy" size="5" :disabled="cansave">%</td>
                  </tr>
                  <tr>
                    <td valign="middle" style="-ms-word-break: break-all;">营业员服装</td>
                    <td valign="middle" style="-ms-word-break: break-all;" />
                    <td valign="middle">
                      <el-radio-group v-model="form.newht.yyyfz" :disabled="cansave">
                        <el-radio label="着品牌制服" />
                        <el-radio label="着群光制服" />
                      </el-radio-group>
                    </td>
                    <td valign="middle" rowspan="1" colspan="1"><br></td>
                  </tr>
                  <tr v-if="form.operationtype!=='自营'">
                    <td valign="middle" style="-ms-word-break: break-all;">是否配合群光卡</td>
                    <td valign="middle" style="-ms-word-break: break-all;" />
                    <td valign="middle">
                      <el-radio-group v-model="form.newht.ifcard" :disabled="cansave">
                        <el-radio label="是">是（特价<input v-model="form.newht.cardzk" type="number" style="width: 50px" max="10" :disabled="cansave">折）</el-radio>
                        <el-radio label="否" />
                      </el-radio-group>
                    </td>
                    <td valign="middle" rowspan="1" colspan="1"><br></td>
                  </tr>
                  <tr>
                    <td valign="middle" style="-ms-word-break: break-all;">专柜人数（人）</td>
                    <td valign="middle" style="-ms-word-break: break-all;"><input v-model="form.oldht.zgrs" size="20" value="" :disabled="cansave"readonly="true"></td>
                    <td valign="middle"><input v-model="form.newht.zgrs" size="20" value="" :disabled="cansave" @change="changezgrs()"></td>
                    <td valign="middle" rowspan="1" colspan="1">
                      <span id="zgrscy" class="ue_t" name="zgrscy" type="xfield">{{ form.newht.zgrs-form.oldht.zgrs }}
                      </span>
                    </td>
                  </tr>
                  <tr>
                    <td valign="middle" style="-ms-word-break: break-all;">非合同备注</td>
                    <td valign="middle" style="-ms-word-break: break-all;"><textarea v-model="form.oldht.remarks" style="width: 80%; height: 150px;" :disabled="cansave" /></td>
                    <td valign="middle"><textarea v-model="form.newht.remarks" style="width: 80%; height: 150px;" :disabled="cansave" /></td>
                    <td valign="middle" rowspan="1" colspan="1"><br></td>
                  </tr>
                  <tr v-if="form.operationtype==='自营'">
                    <td valign="middle" style="-ms-word-break: break-all;">违约金</td>
                    <td valign="middle" style="-ms-word-break: break-all;"><input v-model="form.oldht.liquidateddamages" size="20" value="" :disabled="cansave"></td>
                    <td valign="middle"><input v-model="form.newht.liquidateddamages" size="20" value="" :disabled="cansave"></td>
                    <td valign="middle" rowspan="1" colspan="1"><br></td>
                  </tr>
                  <tr v-if="form.operationtype==='自营'">
                    <td valign="middle" style="-ms-word-break: break-all;">退货约定</td>
                    <td valign="middle" style="-ms-word-break: break-all;" />
                    <td valign="middle">
                      <el-radio-group v-model="form.newht.returnagreement" :disabled="cansave">
                        <el-radio label="1">乙方同意接受甲方未售出的商品无条件退货</el-radio>
                        <el-radio label="2">其他<input v-model="form.newht.returnway" style="width:200px;margin-left: 5px" :disabled="cansave"></el-radio>
                      </el-radio-group>
                    </td>
                    <td valign="middle" rowspan="1" colspan="1"><br></td>
                  </tr>
                  <tr v-if="form.operationtype==='自营'">
                    <td valign="middle" style="-ms-word-break: break-all;">损耗补偿</td>
                    <td valign="middle" style="-ms-word-break: break-all;" />
                    <td valign="middle">按进货金额的<input v-model="form.newht.losscompensation" size="20" style="width:100px;margin-left: 5px" type="number" value="" :disabled="cansave">%</td>
                    <td valign="middle" rowspan="1" colspan="1"><br></td>
                  </tr>
                </tbody>
              </table>
            </div>
            <div v-show="choosetab===2" style="width: 99%;padding: 2px;font-size: 14px ">
              <u-table
                :data="form.kkdata.datalist"
                :options="listOptions"
                :page="false"
                :fetch="hdlList"
              >
                <template v-slot:left>
                  <el-table-column label="扣款费用" prop="kkfy" align="center" fixed="left" width="300px" />
                  <el-table-column v-for="(colItem, colIndex) in form.kkdata.columnlist" :key="colIndex" :label="colItem.label" :prop="colItem.prop" :editable="true">
                    <template slot-scope="scope">
                      <el-row>
                        <template v-if="isPersonnelManagementFee(colItem.prop,scope.row.kkfy)">
                          <el-row>
                            <el-col :span="10">
                              <span>单价:</span>
                              <el-input v-model="scope.row[colItem.prop].dj" style="width: 70px" :disabled="cansave" @change="getFyByDj(scope.row,colItem.prop)" />
                              <span>{{ scope.row.djdw }}，</span>
                            </el-col>
                            <el-col :span="10">
                              <span>费用:</span>
                              <el-input v-model="scope.row[colItem.prop].fy" style="width: 70px" :disabled="cansave" />
                              <span>{{ scope.row.fydw }}</span>
                            </el-col>
                          </el-row>
                        </template>
                        <template v-else>
                          <el-col>
                            <el-input v-model="scope.row[colItem.prop]" style="width: 100px" :disabled="cansave" />
                            <!--                            <span v-if="scope.row.kkfy==='收银服务费（按营业额、现金抵用券除外)计提'||scope.row.kkfy==='信用卡分期付款' ">%</span>-->
                            <span v-if="scope.row.datatype ==='percent'">%</span>
                          </el-col>
                        </template>
                      </el-row>
                    </template>
                  </el-table-column>
                  <el-table-column label="差异" prop="cy" align="center" fixed="right" width="200px">
                    <template slot-scope="scope">
                      <span v-if="scope.row.ifunit=='否'&&form.kkdata.columnlist.length>0&&form.kkdata.columnlist[0].prop==='原合约'" id="kkcy" type="xfield">{{ scope.row['第1合约年']-scope.row['原合约'] }}</span>
                      <span v-if="scope.row.ifunit=='是'&&form.kkdata.columnlist.length>0&&form.kkdata.columnlist[0].prop==='原合约'" id="kkcy" type="xfield">{{ scope.row['第1合约年'].fy-scope.row['原合约'].fy }}</span>
                    </template>
                  </el-table-column>
                </template>
                <template v-slot:right>
                  <el-table-column label="操作" align="center" fixed="right" width="60px">
                    <template slot-scope="{ row }">
                      <el-button v-if="row.candelete" type="text" @click="handleDeleteKk(row)">删除</el-button>
                    </template>
                  </el-table-column>
                </template>
              </u-table>
              <el-form-item> <el-button type="primary" :disabled="cansave" plain @click="handleKkTable()">添加</el-button></el-form-item>
              <table width="98%" class="linkeytableHT tableThree" data-sort="sortDisabled"><tbody>
                <tr id="lxrtr1">
                  <td valign="middle" style="-ms-word-break: break-all;">手机号码（电子合同将由该手机号送达务必填写正确）</td>
                  <td valign="middle" style="-ms-word-break: break-all;"><input v-model="form.newht.lxtel" size="20" value="" :disabled="cansave"></td>
                </tr>
                <tr>
                  <td valign="middle" style="-ms-word-break: break-all;">专柜平面图</td>
                  <td valign="middle" style="-ms-word-break: break-all;">
                    <u-upload v-model="form.newht.zgthumb" name="file" :disabled="cansave" />
                  </td>
                </tr>
                <tr>
                  <td valign="middle" rowspan="1" colspan="1">厂商意向书</td>
                  <td valign="middle" rowspan="1" colspan="1">
                    <u-upload-multiple-files v-model="form.newht.fileList" name="file" :disabled="cansave" :size="5" :limit="1" />
                  <!--                    <u-upload-operation-file v-model="form.newht.fileList" name="file"  :disabled="cansave" :size="5" />-->
                  </td>
                </tr>
                <tr>
                  <td valign="middle" style="-ms-word-break: break-all;">保证人</td>
                  <td valign="middle" style="-ms-word-break: break-all;"><input v-model="form.newht.bzr" size="20" value="" :disabled="cansave"></td>
                </tr>
                <tr>
                  <td valign="middle" style="-ms-word-break: break-all;">补充条款</td>
                  <td valign="middle" style="-ms-word-break: break-all;"><textarea v-model="form.newht.bctk" style="width: 80%; height: 150px;" :disabled="cansave" /></td>
                </tr>
                <tr>
                  <td valign="middle" style="-ms-word-break: break-all;">合同链接</td>
                  <td valign="middle" style="-ms-word-break: break-all;" rowspan="1" colspan="2">
                    <div :hidden="form.contractUrl===''">
                      <el-link type="primary" @click="openContract(form.contractUrl)">查看合同</el-link>
                      <el-link type="primary" style="padding-left: 15px" @click="downloadContract">下载合同</el-link>
                    </div>
                  </td>
                </tr>
              </tbody>
              </table>
            </div>
          </div>

        </div>
        <div>
          <el-form-item>
            <el-button type="primary" :disabled="cansave" @click="onSave()">保存</el-button>
            <el-button type="primary" :disabled="cansubmit" @click="onSubmit('contractform')">发起流程</el-button>
            <el-button type="primary" :disabled="canmodify" @click="onModify()">修改</el-button>
            <el-button :disabled="canrevoke" @click="onRevoke()">撤销流程</el-button>
            <el-button :disabled="disableflag" @click="onAbate('contractform')">作废</el-button>
          </el-form-item>
          <el-form-item v-if="ifcancontractagain(nickname)">
            <el-button type="primary" style="margin-left: 20px" size="small" @click="contractagain">重新生成合同</el-button>
            <!--                <a :href="downUrl" :download="form.contractname">下载合同</a>-->
            <!--                <el-button type="primary"  @click="downloadFile">下载附件</el-button>-->
          </el-form-item>
        </div>
      </el-form>
    </u-page>
    <el-drawer
      title="专柜信息"
      :visible.sync="zgtable"
      direction="rtl"
      size="50%"
    >
      <div style="margin-top: 5px;padding-left: 10px">
        <el-row>
          <el-col :span="8">
            <el-input v-model="zgkeyWord" placeholder="请输入内容" class="input-with-select" @input="zgkeyWordChange()" />
          </el-col>
          <el-col :span="12">
            <div style="font-size:12px;padding-top: 7px">（可输入专柜编号、或专柜名称的部份文字进行筛选）</div>
          </el-col>
        </el-row>
      </div>
      <u-table
        :data="zgdata"
        :options="listOptions"
        :columns="zgcolumns"
      >
        <template v-slot:right>
          <el-table-column label="操作" align="center" fixed="right">
            <template slot-scope="{ row }">
              <el-button type="text" @click="getZg(row)">选择</el-button>
            </template>
          </el-table-column>
        </template>
      </u-table>
    </el-drawer>
    <el-drawer
      title="厂商列表"
      :visible.sync="firmListable"
      direction="rtl"
      size="50%"
    >
      <div style="margin-top: 5px;padding-left: 10px">
        <el-row>
          <el-col :span="8">
            <el-input v-model="firmKeyWord" placeholder="请输入内容" class="input-with-select" />
            <el-button style="margin-top: 5px" type="primary" @click="getFirmList()">查询</el-button>
          </el-col>
          <el-col :span="12">
            <div style="font-size:12px;color: #C03639;padding-top: 7px">（输入厂商名称中的至少两个文字进行筛选）</div>
          </el-col>
        </el-row>
      </div>
      <u-table
        :data="firmListData"
        :options="listOptions"
        :columns="firmcolumns"
      >
        <template v-slot:right>
          <el-table-column label="操作" align="center" fixed="right">
            <template slot-scope="{ row }">
              <el-button type="text" @click="getFirm(row)">选择</el-button>
            </template>
          </el-table-column>
        </template>
      </u-table>
    </el-drawer>
    <el-drawer
      title="扣款列表"
      :visible.sync="kkListable"
      direction="rtl"
      size="50%"
    >
      <u-table
        :data="kkListData"
        :options="listOptions"
        :columns="kkcolumns"
      >
        <template v-slot:right>
          <el-table-column label="操作" align="center" fixed="right">
            <template slot-scope="{ row }">
              <el-button type="text" @click="getDeduct(row)">选择</el-button>
            </template>
          </el-table-column>
        </template>
      </u-table>
    </el-drawer>

  </div>
</template>

<script>
import { mapGetters } from 'vuex'

export default {
  components: {
  },
  data() {
    return {
      api: this.$u.api.ContractOperation,
      applyapi: this.$u.api.ContractApply,
      dataapi: this.$u.api.ContractFormdata,
      // 保存按钮激活
      cansave: false,
      // 提交按钮激活
      cansubmit: true,
      // 修改按钮激活
      canmodify: true,
      // 撤销流程按钮激活
      canrevoke: true,
      // 作废按钮
      disableflag: true,
      zgtable: false,
      zgkeyWord: '',
      kkfyList: ['人员培训费', '物业管理费'],
      // 厂商弹窗
      firmListable: false,
      floors: [],
      zqList: [
        {
          zqid: 1,
          zqname: '月结'
        },
        {
          zqid: 2,
          zqname: '半月结'
        },
        {
          zqid: 3,
          zqname: '营业日'
        },
        {
          zqid: 4,
          zqname: '/'
        },
        {
          zqid: 5,
          zqname: '其他'
        }
      ],
      pqList: [15, 25, 30, 45],
      jsfsList: [
        {
          jsfsid: 0,
          jsfs: '无目标'
        },
        {
          jsfsid: 1,
          jsfs: '保销售'
        },
        {
          jsfsid: 2,
          jsfs: '保毛利'
        }/* ,
        {
          jsfsid: 3,
          jsfs: '有保底销售有目标销售'
        },
        {
          jsfsid: 4,
          jsfs: '有保底毛利有目标销售'
        } */
      ],
      jkfsList: [
        {
          jkfsid: 0,
          jkfs: '结算付款'
        },
        {
          jkfsid: 1,
          jkfs: '结算提现'
        },
        {
          jkfsid: 2,
          jkfs: '周期提现'
        },
        {
          jkfsid: 3,
          jkfs: '自收银'
        }
      ],
      tableData: [], // 表格绑定数据
      zgdata: [],
      searchZgData: [],
      zgcolumns: [{ prop: 'deptid', label: '部门编号' }, { prop: 'dept_name', label: '部门名称' }],
      firmKeyWord: '',
      firmListData: [
        {
          vendorcode: '',
          vendorname: ''
        }
      ],
      labelMap: {
        '联营': '抽成（%）',
        '租赁': '租金',
        '餐饮': '租金',
        '线上联营': '抽成（%）',
        '线上租赁': '租金'
      },
      textMap: {
        '0': '此处填写比例，单位为%',
        '1': '此处填写租金金额，单位为元',
        '2': '此处填写租金金额，单位为元',
        '3': '此处填写租金金额，单位为元'
      },
      firmcolumns: [{ prop: 'vendorcode', label: '厂商编号' }, { prop: 'vendorname', label: '厂商名称' }],
      departments: [],
      deptInfostable: false,
      deptkeyWord: '',
      choosetab: 1,
      listLoading: false,
      form: {
        code: 0,
        formid: '',
        updateflag: false,
        contractUrl: '',
        typename: '',
        // 人员信息
        applicantnickname: '',
        applicantusername: '',
        applicantuserid: '',
        preparernickname: '',
        preparerusername: '',
        prepareruserid: '',
        viewerusername: '',
        viewernickname: '',
        applyTime: '',
        ifcontract: '',
        sequence: '',
        sealtype: '',
        agreementtype: '',
        operationtype: '',
        datedetails: [],
        ccdetails: [],
        fjcolumns: [],
        fjdata: [{
          hyyear: '',
          yearmonth: '',
          bdfj: '',
          clearing: 0
        }],
        kkdata: {
          columnlist: [{ label: '原合约', prop: '原合约' }, { label: '第1合约年', prop: '第1合约年' }],
          datalist: [
            { kkfy: '保证金',
              原合约: '',
              第1合约年: ''
            },
            {
              kkfy: '资源占用费（元）',
              原合约: '',
              第1合约年: ''
            },
            {
              kkfy: '人员管理费（元/月）',
              原合约: '',
              第1合约年: ''
            },
            { kkfy: '人员培训费',
              原合约: '',
              第1合约年: {
                dj: '',
                fy: ''
              },
              djdw: '元/人/期',
              fydw: '元/期'
            },
            { kkfy: '物业管理费',
              原合约: '',
              第1合约年: {
                dj: '',
                fy: ''
              },
              djdw: '元/平米/月',
              fydw: '元/月'
            },
            {
              kkfy: '场地清洁费（元/月）',
              原合约: '',
              第1合约年: ''
            },
            {
              kkfy: '特殊活动服务费（元/期）',
              原合约: '',
              第1合约年: ''
            },
            {
              kkfy: '公共设施使用费（元/月）',
              原合约: '',
              第1合约年: ''
            },
            {
              kkfy: '促销服务费（元/月）',
              原合约: '',
              第1合约年: ''
            },
            {
              kkfy: '质量保证金（元）',
              原合约: '',
              第1合约年: ''
            },
            {
              kkfy: '现场管理费（元/月）',
              原合约: '',
              第1合约年: ''
            }, {
              kkfy: '收银服务费（按营业额、现金抵用券除外)计提',
              原合约: '',
              第1合约年: ''
            }, {
              kkfy: '信用卡分期付款',
              原合约: '',
              第1合约年: ''
            }, {
              kkfy: '品牌宣传费',
              原合约: '',
              第1合约年: ''
            }, {
              kkfy: '保全服务费',
              原合约: '',
              第1合约年: ''
            }
          ]
        },
        oldht: {
          contractcode: '',
          hsfs: 5,
          deptname: '',
          firmcode: '',
          firmname: '',
          zgcode: '',
          zgname: '',
          brand: '',
          bl: '',
          floor: '',
          area: '',
          startdate: '',
          enddate: '',
          // 分解参数
          yymb: 0,
          yyxse: 0,
          yymle: 0,
          mbxse: 0,
          bdqsfs: '',
          ccexplain: '',
          znjsqfs: '每月5号',
          zqid: '',
          zqname: '',
          pqts: '0',
          zgrs: 0,
          yyyfz: '',
          remarks: '',
          liquidateddamages: '',
          zffs: '',
          jpqx: '',
          jyfy: '300'
        },
        newht: {
          contractcode: '',
          hsfs: 5,
          jsfs: '',
          jkfs: '',
          deptname: '',
          firmcode: '',
          firmname: '',
          vendoruuid: '',
          zgcode: '',
          zgname: '',
          brand: '',
          bl: '',
          floor: '',
          area: '',
          startdate: '',
          enddate: '',
          firstendday: '',
          indate: '',
          lxtel: '',
          // 分解参数
          syfs: '',
          hsrange: '',
          ifhsbd: '',
          yymb: 0,
          yyxse: 0,
          yymle: 0,
          mbxse: 0,
          bdqsfs: '每月核算，合约年满结算',
          znjsqfs: '每月5号',
          ccexplain: '',
          zqid: '',
          zqsm: '',
          yyyfz: '',
          zgrs: '',
          zqname: '',
          pqts: '0',
          remarks: '',
          liquidateddamages: '',
          returnagreement: '',
          returnway: '',
          losscompensation: '',
          zffs: '',
          ifczk: '',
          czkzkjs: '',
          czkzkjsday: '',
          jpqx: '',
          jyfy: '300',
          zgthumb: '',
          bzr: '',
          bctk: '',
          fileList: '',
          ifcard: '',
          cardzk: ''
        }
      },
      // ======================== 扣款选择弹窗====================
      kkListable: false,
      kkListData: [],
      // 表格
      kkcolumns: [
        {
          prop: 'deductname',
          label: '扣款名称'
        },
        {
          prop: 'djunit',
          label: '单价单位'
        },
        {
          prop: 'fyunit',
          label: '费用单位'
        },
        {
          prop: 'remark',
          label: '备注'
        },
        {
          prop: 'defaultdate',
          label: '默认日期'
        }
      ],
      // 规则
      contractform: {
        ifcontract: [
          { required: true, message: '请选择是否生成合同', trigger: 'change' }
        ],
        sequence: [
          { required: true, message: '请选择合同顺序', trigger: 'change' }
        ],
        sealtype: [
          { required: true, message: '请选择用印类型', trigger: 'change' }
        ],
        agreementtype: [
          { required: true, message: '请选择合同类型', trigger: 'change' }
        ],
        operationtype: [
          { required: true, message: '请选择呈报类型', trigger: 'change' }
        ]
      },
      listOptions: {
        stripe: true
      },
      sumFjData: 0
    }
  },
  created() {},
  mounted() {
    this.getDepartments()
    this.getFloors()
    // 如果传了参数，则加载数据
    if (this.$route.query.formcode != null) {
      if (this.$route.query.ifcopy === '1') {
        this.getApplicant()
        // 续约操作处理
        this.handleCopy(this.$route.query)
      } else {
        // 正常查看或编辑
        this.getViewers()
        this.getOperationFormdata(this.$route.query.formcode)
      }
    } else {
      this.getApplicant()
    }
    this.getkkfyList()
  },
  computed: {
    ...mapGetters([
      'nickname'
    ]),
    showSalesTarget() {
      const { operationtype, newht } = this.form
      if (operationtype === '自营') return false
      if (['联营', '线上联营'].includes(operationtype)) return newht.jsfs === 1
      if (['租赁', '餐饮', '线上租赁'].includes(operationtype)) {
        return newht.jsfs === 1 || (newht.jsfs === 2 && newht.syfs !== '1')
      }
      return false
    },
    showProfitTarget() {
      const { operationtype, newht } = this.form
      if (operationtype === '自营') return false
      if (['联营', '线上联营'].includes(operationtype)) return newht.jsfs > 1
      if (['租赁', '餐饮', '线上租赁'].includes(operationtype)) {
        return newht.jsfs > 1 && newht.syfs === '1'
      }
      return false
    }
  },
  methods: {
    /* updateEndDate(row, index) {
      const self = this
      // 获取年月和该月最后一天
      const yearMonth = row.endday.split('-')
      const year = parseInt(yearMonth[0])
      const month = parseInt(yearMonth[1])
      const lastDay = new Date(year, month, 0).getDate()
      // 获取下一行
      const nextRow = this.form.datedetails[index + 1]
      const currentDate = new Date(row.endday)
      const nextendday = nextRow.endday
      // 比较大小
      if (row.endday >= nextendday) {
        self.$message.error('结束日期不能大于下一合约年结束日期！')
        row.endday = ''
        return
      }
      if (row.endday <= row.startday) {
        self.$message.error('结束日期不能小于开始日期！')
        row.endday = ''
        return
      }
      row.endday = `${year}-${month}-${lastDay}`
      // 计算开始时间和结束时间之间的月份数
      const endRowDate = this.parseDate(row.endday)
      const startDate = new Date(self.form.newht.startdate)
      const endDate = new Date(self.form.newht.enddate)
      const endDateStr = this.parseDate(self.form.newht.enddate)
      const monthDiff = (endDate.getFullYear() - startDate.getFullYear()) * 12 + (endDate.getMonth() - startDate.getMonth()) + 1
      // 处理13个月的情况
      if (monthDiff === 13 && endRowDate >= endDateStr) {
        // 如果是最后一个日期明细,并且结束日期等于合约期限结束日期,则删除下一合约年
        this.form.datedetails.splice(index + 1, 1)
        this.getdeductionData()
        self.$message.warning('合约年已变更，扣款信息重置请重新填写')
      } else if (endRowDate >= endDateStr) {
        self.$message.error('时间选择有误，请重新选择')
        row.endday = ''
        return
      } else {
        const nextDate = new Date(currentDate.getFullYear(), currentDate.getMonth() + 1, currentDate.getDate() + 1)
        nextRow.startday = nextDate.toISOString().split('T')[0]
      }
    },*/
    updateEndDate(row) {
      const self = this
      // 获取年月和该月最后一天
      const yearMonth = row.endday.split('-')
      const year = parseInt(yearMonth[0])
      const month = parseInt(yearMonth[1])
      const lastDay = new Date(year, month, 0).getDate()
      // row.endday = `${year}-${month}-${lastDay}`
      row.endday = `${year}-${month.toString().padStart(2, '0')}-${lastDay.toString().padStart(2, '0')}`
      self.form.newht.firstendday = row.endday
      self.api.datedetailswithfirstendday(self.form.newht).then(res => {
        this.form.datedetails = res.data
        this.getdeductionData()
      }).catch(() => {
        return
      })
    },
    parseDate(dateString) {
      const parts = dateString.split('-')
      const year = parseInt(parts[0], 10)
      const month = parseInt(parts[1], 10) - 1 // JavaScript中月份从0开始
      const day = parseInt(parts[2], 10)
      return new Date(year, month, day)
    },
    // 加载楼层
    getFloors() {
      const self = this
      self.applyapi.floors().then(res => {
        this.floors = res.data
      })
    },
    // 加载扣款费用筛选集合
    getkkfyList() {
      const self = this
      self.api.kkfyList().then(res => {
        this.kkfyList = res.data
      })
    },
    // 加载申请人员
    getApplicant() {
      const self = this
      self.applyapi.applicant().then(res => {
        self.form.applicantusername = res.data.username
        self.form.applicantnickname = res.data.usernickname
        self.form.applicantuserid = res.data.userid
        self.form.preparerusername = res.data.username
        self.form.preparernickname = res.data.usernickname
        self.form.prepareruserid = res.data.userid
        self.form.viewerusername = res.data.username
        self.form.viewernickname = res.data.usernickname
        self.form.applyTime = res.data.nowtime
      })
    },
    // 加载查看人
    getViewers() {
      const self = this
      self.applyapi.applicant().then(res => {
        self.form.viewerusername = res.data.username
        self.form.viewernickname = res.data.usernickname
      })
    },
    // 加载部门
    getDepartments() {
      const self = this
      self.applyapi.departments().then(res => {
        this.departments = res.data
      })
    },
    queryoldhtAndClone() {
      const self = this
      self.api.queryht(self.form.oldht).then(res => {
        self.form.oldht = res.data
        if (self.form.updateflag === false) {
          this.clonehtInfo()
        }
        this.fillOriginalContractData(self.form.oldht.deductDetailList)
      })
    },
    clonehtInfo() {
      const self = this
      self.form.newht.deptid = self.form.oldht.deptid
      self.form.newht.deptname = self.form.oldht.deptname
      self.form.newht.firmcode = self.form.oldht.firmcode
      self.form.newht.firmname = self.form.oldht.firmname
      self.form.newht.zgcode = self.form.oldht.zgcode
      self.form.newht.zgname = self.form.oldht.zgname
      self.form.newht.brand = self.form.oldht.brand
      self.form.newht.bl = self.form.oldht.bl
      self.form.newht.floor = self.form.oldht.floor
      self.form.newht.area = self.form.oldht.area
      self.form.newht.zgrs = self.form.oldht.jyry
      const olddate = new Date(self.form.oldht.enddate)
      olddate.setDate(olddate.getDate() + 1)
      self.form.newht.startdate = olddate.toISOString().split('T')[0]
    },
    fillOriginalContractData(deductDetailList) {
      const self = this
      // 遍历 deductDetailList 中的数据
      for (const item of deductDetailList) {
        // 在 kkdata.datalist 中找到对应的项目
        const targetItem = self.form.kkdata.datalist.find(i => i.kkfycode === item.deductid)
        if (targetItem) {
          if (item.ifunit === '是') {
            // 将数据填充到原合约部分
            targetItem.原合约 = {
              ifunit: item.ifunit,
              dj: item.dj,
              fy: item.fy,
              djdw: item.djdw,
              fydw: item.fydw
            }
          } else {
            targetItem.原合约 = item.amount
          }
        }
      }
    },
    // 选择课室功能
    handleDeptId() {
      let obj = {}
      obj = this.departments.find((item) => item.deptid === this.form.newht.deptid)
      this.form.newht.deptname = obj.deptname
    },
    handleJkfs() {
      this.form.newht.zqid = ''
      this.form.newht.zffs = ''
      this.form.newht.pqts = ''
      this.form.newht.jpqx = ''
      if (this.form.newht.jkfs === 0) {
        if (this.form.typename === '自营专柜合作条件呈报表') {
          this.pqList = [15, 25, 30, 45]
        } else {
          this.pqList = [30, 45]
        }
      } else if (this.form.newht.jkfs === 1) {
        this.pqList = [7, 15]
      } else if (this.form.newht.jkfs === 2) {
        this.form.newht.zffs = '自助提现网银'
        this.form.newht.pqts = '0'
        this.form.newht.jpqx = '0'
      } else {
        this.form.newht.zffs = '/'
        this.form.newht.pqts = '0'
        this.form.newht.jpqx = '0'
      }
    },
    // 选择账期
    handleZqId() {
      let obj = {}
      this.form.newht.zffs = ''
      this.form.newht.pqts = ''
      this.form.newht.jpqx = ''
      obj = this.zqList.find((item) => item.zqid === this.form.newht.zqid)
      this.form.newht.zqname = obj.zqname
      /* if (this.form.newht.zqid === 1) {
        if (this.form.typename === '自营专柜合作条件呈报表') {
          this.pqList = [25, 30, 45]
        } else {
          this.pqList = [30, 45]
        }
      } else if (this.form.newht.zqid === 2) {
        this.pqList = [7, 15]
      } else if (this.form.newht.zqid === 3) {
        this.form.newht.zffs = '自助提现网银'
        this.form.newht.pqts = '0'
        this.form.newht.jpqx = '0'
      } else {
        this.form.newht.zffs = '/'
        this.form.newht.pqts = '0'
        this.form.newht.jpqx = '0'
      }*/
    },
    // 选择票期
    handlePqts() {
      const self = this
      if (self.form.newht.zqname !== '' && self.form.newht.pqts !== '') {
        if (self.form.newht.jkfs === 0) {
          if (self.form.newht.zqname === '月结') {
            if (self.form.newht.pqts === 45) {
              this.form.newht.zffs = '月结45天网银'
              this.form.newht.jpqx = 15
            } else if (self.form.newht.pqts === 30) {
              this.form.newht.zffs = '月结30天网银'
              this.form.newht.jpqx = 15
            } else if (self.form.newht.pqts === 25) {
              this.form.newht.zffs = '月结25天网银'
              this.form.newht.jpqx = 15
            } else {
              this.form.newht.zffs = '自助提现网银'
              this.form.newht.jpqx = 7
            }
          }
        } else if (self.form.newht.jkfs === 1) {
          this.form.newht.zffs = '自助提现网银'
          if (self.form.newht.pqts === 7) {
            this.form.newht.jpqx = 3
          } else {
            this.form.newht.jpqx = 7
          }
        } else {
          this.form.newht.zffs = '自助提现网银'
        }
      }
    },
    // 打开专柜选择框
    handleZg() {
      const self = this
      if (self.form.newht.deptname === '') {
        self.$message.error('请先选择扣款部门！')
        return
      }
      self.api.zgdatas(self.form.newht).then(res => {
        this.zgdata = res.data
        this.searchZgData = res.data
      })
      self.zgtable = true
    },
    // 获取专柜
    getZg(row) {
      const self = this
      self.form.newht.zgcode = row.deptid
      self.form.newht.zgname = row.dept_name
      self.form.newht.bl = row.bl
      self.zgtable = false
    },
    // 重新选择储值卡账款结算重置天数
    handleCzkzkjs() {
      const self = this
      self.form.newht.czkzkjsday = ''
    },
    // 打开厂商选择框
    handleFirmList() {
      const self = this
      self.firmListable = true
    },
    // 获取厂商列表
    getFirmList() {
      const self = this
      self.api.firmlist(self.firmKeyWord).then(res => {
        this.firmListData = res.data
      })
    },
    // 获取厂商信息
    getFirm(row) {
      const self = this
      self.form.newht.firmcode = row.vendorcode
      self.form.newht.vendoruuid = row.vendoruuid
      self.form.newht.firmname = row.vendorname
      self.firmListable = false
    },
    // 根据厂商编号获取厂商信息
    getFirmbyfirmcode() {
      const self = this
      self.api.firmbyfirmcode(self.form.newht.firmcode).then(res => {
        self.form.newht.firmname = res.data.vendorname
        self.form.newht.vendoruuid = res.data.uuid
      })
    },
    // 开始日期动作（进柜日期默认合同开始日期）
    handleStartdateChanged() {
      const self = this
      if (self.form.agreementtype === '') {
        self.$message.error('请先选择合同类型！')
        self.form.newht.startdate = ''
        return
      }
      if (self.form.operationtype === '') {
        self.$message.error('请先选择呈报类型！')
        self.form.newht.startdate = ''
        return
      }
      // 计算合约期限分解
      if (self.form.newht.startdate !== '' && self.form.newht.enddate !== '') {
        this.gethtdatedetails()
      }
    },
    // 结束日期动作（结束日期必须大于开始日期）
    handleEnddateChanged() {
      const self = this
      if (self.form.agreementtype === '') {
        self.$message.error('请先选择合同类型！')
        self.form.newht.enddate = ''
        return
      }
      if (self.form.operationtype === '') {
        self.$message.error('请先选择呈报类型！')
        self.form.newht.enddate = ''
        return
      }
      if (self.form.newht.enddate <= self.form.newht.startdate) {
        self.$message.error('结束日期必须大于开始日期！')
        self.form.newht.enddate = ''
        return
      }
      // 计算合约期限分解
      if (self.form.newht.startdate !== '' && self.form.newht.enddate !== '') {
        this.gethtdatedetails()
      }
    },
    // 通过开始日期结束日期计算合约分解
    gethtdatedetails() {
      const self = this
      self.api.datedetails(self.form.newht).then(res => {
        this.form.datedetails = res.data
        this.getdeductionData()
      }).catch(() => {
        return
      })
    },
    // 复制计算
    getcopyhtdatedetails() {
      const self = this
      self.api.datedetails(self.form.newht).then(res => {
        this.form.datedetails = res.data
        this.getdeductionDatabyCopy()
      }).catch(() => {
        return
      })
    },
    // 合同类型改变
    hanleAgreementtypeChange() {
      this.getdeductionData()
    },
    // 呈报类型改变则表单名称改变
    hanleOperationtypetypeChange() {
      const self = this
      if (self.form.operationtype === '联营') {
        self.form.typename = '联营专柜合作条件呈报表'
        self.form.newht.hsfs = 3
        self.form.oldht.hsfs = 3
      } else if (self.form.operationtype === '餐饮') {
        self.form.typename = '餐饮专柜合作条件呈报表'
        self.form.newht.hsfs = 5
        self.form.oldht.hsfs = 5
      } else if (self.form.operationtype === '租赁') {
        self.form.typename = '租赁专柜合作条件呈报表'
        self.form.newht.hsfs = 5
        self.form.oldht.hsfs = 5
      } else if (self.form.operationtype === '线上联营') {
        self.form.typename = '联营商家入驻合作协议'
        self.form.newht.hsfs = 3
        self.form.oldht.hsfs = 3
      } else if (self.form.operationtype === '线上租赁') {
        self.form.typename = '租赁商家入驻合作协议'
        self.form.newht.hsfs = 5
        self.form.oldht.hsfs = 5
      } else {
        self.form.typename = '自营专柜合作条件呈报表'
        self.form.newht.hsfs = 0
        self.form.oldht.hsfs = 0
      }
      this.getdeductionData()
    },
    // 获取扣款项目
    getdeductionData() {
      const self = this
      self.api.deductionsbychoosetype(self.form).then(res => {
        this.form.kkdata = res.data
        if (this.form.agreementtype === '续签') {
          if (self.form.oldht.contractcode !== '') {
            this.fillOriginalContractData(self.form.oldht.deductDetailList)
          }
        }
      }).catch(() => {
        return
      })
    },
    // 复制的扣款项目
    getdeductionDatabyCopy() {
      const self = this
      self.api.copydeductionsbychoosetype(self.form).then(res => {
        this.form.kkdata = res.data
        if (this.form.agreementtype === '续签') {
          if (self.form.oldht.contractcode !== '') {
            this.fillOriginalContractData(self.form.oldht.deductDetailList)
          }
        }
      }).catch(() => {
        return
      })
    },
    // 根据结算方式显示分解表
    confirmccdetails() {
      const self = this
      let flag = false
      const cclastindex = self.form.ccdetails.length - 1
      if (self.form.ccdetails[cclastindex].endDay !== self.form.newht.enddate || self.form.ccdetails[0].startDay !== self.form.newht.startdate) {
        self.$message.error('请检查抽成表日期是否正确！')
        return
      }
      if (self.form.operationtype === '租赁' || self.form.operationtype === '餐饮' || self.form.operationtype === '线上租赁') {
        if (self.form.newht.jsfs === 0 && self.form.newht.yyxse > 0) {
          flag = true
        } else if (self.form.newht.jsfs === 1 && self.form.newht.yyxse > 0) {
          flag = true
        } else if (self.form.newht.jsfs === 2) {
          if (self.form.newht.syfs === '1' && self.form.newht.yymle > 0) {
            flag = true
          } else if (self.form.newht.yyxse > 0) {
            flag = true
          }
        }
      } else if (self.form.operationtype === '联营' || self.form.operationtype === '线上联营') {
        if (self.form.newht.jsfs === 0 && self.form.newht.yyxse > 0) {
          flag = true
        } else if (self.form.newht.jsfs === 1 && self.form.newht.yyxse > 0) {
          flag = true
        } else if (self.form.newht.jsfs === 2 && self.form.newht.yymle > 0) {
          flag = true
        }
      } else {
        flag = true
      }
      if (self.form.newht.jsfs !== '' && self.form.ccdetails.length > 0 && flag === true) {
        self.api.fjdetails(self.form).then(res => {
          this.form.fjcolumns = res.data.fjcolumns
          this.form.fjdata = res.data.fjdata
          // 如果syfs是两者取其高，则清算标记全标记
          if (self.form.newht.syfs === '3') {
            for (let x = 0; x < self.form.fjdata.length; x++) {
              self.form.fjdata[x].clearing = true
            }
          }
        }).catch(() => {
          return
        })
      } else {
        self.$message.error('请确认是否为无目标合同！')
        return
      }
    },
    // 选择核算方式
    hdlJsfs() {
      const self = this
      if (self.form.newht.jsfs === 0) {
        if (self.form.operationtype === '租赁' || self.form.operationtype === '餐饮' || self.form.operationtype === '线上租赁') {
          self.form.newht.syfs = '0'
        } else {
          self.form.newht.syfs = ''
        }
        self.form.newht.ifhsbd = '否'
        self.form.ccdetails = []
        self.form.fjcolumns = []
        self.form.fjdata = []
      } else if (self.form.newht.jsfs === 1) {
        self.form.newht.syfs = '0'
        if (self.form.operationtype === '餐饮') {
          self.form.newht.ifhsbd = '否'
        } else {
          self.form.newht.ifhsbd = ''
        }
        self.form.ccdetails = []
        self.form.fjcolumns = []
        self.form.fjdata = []
      } else {
        self.form.newht.syfs = ''
        self.form.newht.ifhsbd = '否'
        self.form.ccdetails = []
        self.form.fjcolumns = []
        self.form.fjdata = []
      }
    },
    // 选择核算保底与否
    hdlIfhsbd() {
      const self = this
      self.form.ccdetails = []
      self.form.fjcolumns = []
      self.form.fjdata = []
    },
    // 添加需求详情
    addccdetails() {
      const self = this
      let plStr = ''
      let startStr = ''
      if (self.form.newht.jsfs === 1 && self.form.newht.ifhsbd === '') {
        self.$message.error('请先选择是否分商品核算目标！')
        return
      }
      if (self.form.ccdetails.length === 0) {
        startStr = self.form.newht.startdate
      }
      if (self.form.datedetails.length > 0) {
        if (self.form.newht.ifhsbd === '否') {
          plStr = self.form.newht.zgname
        }
        if (self.form.ccdetails.length === 0) {
          startStr = self.form.newht.startdate
        }
        const newCcDetails = {
          pl: plStr,
          startDay: startStr,
          endDay: '',
          cc: '',
          bz: '',
          income: '',
          mbxx: '',
          bdmle: '',
          cxfwf: '',
          whfwf: '',
          cmbcxfwf: '',
          cmbwhfwf: '',
          cmbzj: '',
          seqNum: self.form.ccdetails.length + 1
        }
        // 检查是否存在同品类商品
        const samePlItems = self.form.ccdetails.filter(item => item.pl === plStr)
        if (samePlItems.length > 0) {
          const lastSamePlItem = samePlItems[samePlItems.length - 1]
          const lastEndDay = new Date(lastSamePlItem.endDay)
          newCcDetails.startDay = new Date(lastEndDay.getTime() + 86400000).toISOString().slice(0, 10)
        }

        self.form.ccdetails.push(newCcDetails)
      } else {
        self.$message.error('请先选择合约期限！')
        return
      }
    },
    // 填入品类自动生成开始时间
    changeccpl(row, index) {
      row.startDay = ''
      const self = this
      if (index === 0) {
        row.startDay = self.form.newht.startdate
      } else if (index > 0) {
        const lastrow = self.form.ccdetails[index - 1]
        if (row.pl === lastrow.pl) {
          const lastEndDay = new Date(lastrow.endDay)
          row.startDay = new Date(lastEndDay.getTime() + 86400000).toISOString().slice(0, 10)
        } else {
          if (lastrow.endDay !== self.form.newht.enddate) {
            self.$message.error('品类' + lastrow.pl + '日期填写不正确，请检查')
            return
          }
          row.startDay = self.form.newht.startdate
        }
      }
    },
    // 判断抽成结束时间
    changeccendday(row) {
      const self = this
      // 判断日期
      if (row.endDay <= row.startDay) {
        self.$message.error('结束日期不能小于开始日期！')
        row.endDay = ''
        return
      }
    },
    // 限制两位小数
    handleCCInput(row) {
      const value = row.cc
      const reg = /^\d+(\.\d{1,2})?$/
      if (!reg.test(value)) {
        row.cc = value.replace(/[^\d.]/g, '').replace(/\.{2,}/g, '.').replace(/^(\-)*(\d+)\.(\d\d).*$/, '$1$2.$3')
      }
    },
    // 选择合约年判断
    handlehyyearChanged(row, index) {
      const self = this
      if (index === 0) {
        if (row.hyyear !== self.form.datedetails[0].title) {
          self.$message.error('请从第一合约年开始！')
          row.hyyear = self.form.datedetails[0].title
          return
        }
      }
    },
    // 删除需求详情
    delccdetails(index) {
      const self = this
      self.$confirm('确认删除吗?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        // 点击确定的操作
        self.form.ccdetails.splice(index, 1)
      }).catch(() => {
        return
      })
    },
    // 计算总金额
    getSummaries(param) {
      const self = this
      const { columns, data } = param
      const sums = []
      columns.forEach((column, index) => {
        // 第一列显示总计
        if (index === 0) {
          sums[index] = '总计'
          return
        }
        // 合约年月和清算标记列不计算
        if (column.property === 'yearmonth' || column.property === 'clearing') {
          sums[index] = ''
          return
        }
        const values = data.map(item => parseFloat(item[column.property]))
        if (!values.every(value => isNaN(value))) {
          sums[index] = values.reduce((prev, curr) => {
            const value = parseFloat(curr)
            if (!isNaN(value)) {
              const sumprev = (Math.round(prev * 100) + Math.round(value * 100)) / 100
              return sumprev.toFixed(2)
            } else {
              return prev
            }
          }, 0)
        } else {
          sums[index] = 'N/A'
        }
      })

      let totalAmount = 0
      // 获取除了第一个元素(总计)和不计算列之外的合计值
      const calculatedSums = sums.filter((_, index) => index > 0 && (columns[index].property !== 'yearmonth' && columns[index].property !== 'clearing'))

      // 计算总金额
      for (let i = 0; i < calculatedSums.length; i++) {
        const value = parseFloat(calculatedSums[i])
        if (!isNaN(value)) {
          totalAmount += value
        }
      }
      self.sumFjData = totalAmount

      return sums
    },
    // 输入分解数字限制小数
    limitToTwoDecimals(row, prop) {
      const value = row[prop]
      const reg = /^\d+(\.\d{1,2})?$/
      if (!reg.test(value)) {
        row[prop] = value.replace(/[^\d.]/g, '').replace(/\.{2,}/g, '.').replace(/^(\-)*(\d+)\.(\d\d).*$/, '$1$2.$3')
      }
    },
    // 扣款费用显示
    isPersonnelManagementFee(col, kkfy) {
      // 根据 kkfy 是否是人员管理费判断是否需要显示两个输入框
      // 返回 true 表示需要显示两个输入框，否则只显示一个输入框
      const self = this
      return self.kkfyList.includes(kkfy)
    },
    getFyByDj(row, name) {
      const self = this
      // 如果是人员培训费 总费用就是单价*专柜人数
      if (row.kkfy === '人员培训费') {
        if (name === '原合约') {
          row[name].fy = row[name].dj * self.form.oldht.zgrs
        } else {
          row[name].fy = row[name].dj * self.form.newht.zgrs
        }
      } else if (row.kkfy === '物业管理费') {
        if (name === '原合约') {
          row[name].fy = row[name].dj * self.form.oldht.area
        } else {
          row[name].fy = row[name].dj * self.form.newht.area
        }
      }
    },
    // 保存
    onSave() {
      const self = this
      // 将表单设置为只读
      this.cansave = true
      self.api.save(self.form).then(res => {
        const typeslist = ['自营', '联营', '租赁']
        // 保存判断费用填写
        if (typeslist.includes(self.form.operationtype)) {
          for (let i = 0; i < self.form.kkdata.datalist.length; i++) {
            const row = self.form.kkdata.datalist[i]
            // 如果费用项目是"人员培训费"
            if (row.kkfy.includes('现场管理费') || row.kkfy.includes('收银机租金')) {
              for (let m = 0; m < self.form.kkdata.columnlist.length; m++) {
                const kk = self.form.kkdata.columnlist[m].label
                if (kk !== '原合约') {
                  // 判断费用
                  if (row[kk] === '' || row[kk] === 0 || row[kk] === '0') {
                    // 通知信息
                    self.$message.warning('请确认是否收取现场管理费或收银机租金')
                  }
                }
              }
            }
          }
        }
        // 主表单提交完成 提交副表单
        // 更新表单编号
        this.form.code = res.data.code
        this.form.formid = res.data.formid
        // 修改提交作废按钮变亮
        this.cansubmit = false
        this.canmodify = false
        this.canrevoke = true
        this.disableflag = false
        // 通知信息
        self.$u.msg(res.msg)
      }).catch(() => {
        this.cansave = false
        return
      })
    },
    // 表单验证
    formValidate() {
      const self = this
      let compareNum = 0
      /* if (self.form.newht.jsfs === 1) {
        compareNum = self.form.newht.yyxse
      } else if (self.form.newht.jsfs === 2) {
        if (self.form.newht.syfs === '1') {
          compareNum = self.form.newht.yymle
        } else {
          compareNum = self.form.newht.yyxse
        }
      }*/
      if (self.form.operationtype === '租赁' || self.form.operationtype === '餐饮' || self.form.operationtype === '线上租赁') {
        compareNum = self.form.newht.yyxse
        if (self.form.newht.jsfs === 2) {
          if (self.form.newht.syfs === '1') {
            compareNum = self.form.newht.yymle
          }
        }
      } else if (self.form.operationtype === '联营' || self.form.operationtype === '线上联营') {
        if (self.form.newht.jsfs === 2 && self.form.newht.yymle > 0) {
          compareNum = self.form.newht.yymle
        } else {
          compareNum = self.form.newht.yyxse
        }
      }
      // 合约开始日期和分解表开始日期对比
      if (Math.abs(Number(self.sumFjData) - compareNum) >= 0.00001) {
        // 通知信息
        self.$message.error('分解表合计金额不正确，请检查！')
        return false
      }
      if (self.form.operationtype !== '自营' && self.form.ccdetails.length === 0) {
        // 通知信息
        self.$message.error('请填写抽成！')
        return false
      }
      // 商品分类判断
      if (self.form.newht.ifhsbd === '是') {
        // 提取所有 pl 值
        const plValues = self.form.ccdetails.map(item => item.pl)
        // 使用 Set 去重后判断长度
        const uniquePlValues = new Set(plValues)
        if (uniquePlValues.size < 2) {
          // 通知信息
          self.$message.error('请检查商品分类是否正确！')
          return false
        }
      }
      // 判断清算标记
      if (self.form.newht.jsfs === 1 || self.form.newht.jsfs === 2) {
        const lasetindex = self.form.fjdata.length - 1
        if (self.form.fjdata.size > 0) {
          if (self.form.fjdata[lasetindex].clearing === false) {
            self.$message.error('请勾选清算标记！')
            return false
          }
        }
      }
      if (self.form.newht.brand === '') {
        // 通知信息
        self.$message.error('请填写品牌！')
        return false
      }

      return true
    },
    // 修改
    onModify() {
      this.cansave = false
      this.cansubmit = true
      this.canmodify = true
      this.canrevoke = true
      this.form.updateflag = true
    },
    // 提交
    onSubmit(formName) {
      const self = this
      self.$confirm('是否确认发起流程？', '提示', { confirmButtonText: '确定', cancelButtonText: '取消', type: 'warning' }).then(() => {
        if (self.form.sealtype === '电子印章') {
          if (self.form.newht.lxtel === '') {
            // 通知信息
            self.$message.error('请填写手机号码！')
            return false
          }
        }
        // 表单验证
        this.$refs[formName].validate((valid) => {
          if (valid) {
            /**
             * 判断表单数据
             */
            const ifcansave = this.formValidate()
            if (ifcansave) {
              // 通过验证进行提交动作
              self.api.submit(self.form).then(res => {
                // 通知信息
                self.$u.msg(res.msg)
                // 初始化数据
                // 刷新页面
                self.$router.go(0)
              }).catch(() => {
                return
              })
            }
          } else {
            return false
          }
        })
      })
    },
    // 撤销钉钉流程
    onRevoke() {
      const self = this
      self.$confirm('是否确认撤销流程？', '提示', { confirmButtonText: '确定', cancelButtonText: '取消', type: 'warning' }).then(() => {
        // 通过验证进行提交动作
        self.applyapi.revoke(self.form).then(res => {
          // 通知信息
          self.$u.msg(res.data)
          // 修改按钮状态
          // 将表单设置为只读
          this.cansave = true
          this.cansubmit = true
          this.canmodify = false
          this.canrevoke = true
          this.disableflag = false
          self.form.statusstr = '撤销流程'
        }).catch(() => {
          return
        })
      })
    },
    // 作废
    onAbate() {
      const self = this
      self.$confirm('是否确认作废表单？', '提示', { confirmButtonText: '确定', cancelButtonText: '取消', type: 'warning' }).then(() => {
        // 通过验证进行提交动作
        self.applyapi.abate(self.form).then(res => {
          // 通知信息
          self.$u.msg(res.data)
          // 刷新页面
          self.$router.go(0)
        }).catch(() => {
          return
        })
      })
    },
    //  获取表单数据并初始化参数
    getOperationFormdata(formcode) {
      const self = this
      self.form.code = formcode
      self.api.operationFormData(self.form).then(res => {
        const maindata = res.data
        self.form.updateflag = true
        self.form.formid = maindata.operationdata.htMainData.formid
        self.form.applicantusername = maindata.applicantusername
        self.form.applicantnickname = maindata.applicantnickname
        self.form.applicantuserid = maindata.applicantuserId
        self.form.preparerusername = maindata.preparerusername
        self.form.preparernickname = maindata.preparernickname
        self.form.typename = maindata.typename
        self.form.operationtype = maindata.operationtype
        self.form.applyTime = maindata.starttime
        self.form.endTime = maindata.endTime
        if (maindata.ifcontract) {
          self.form.ifcontract = '是'
          self.form.sequence = maindata.sequence
          self.form.sealtype = maindata.sealtype
        } else {
          self.form.ifcontract = '否'
        }
        if (maindata.contractUrl !== '') {
          self.form.contractUrl = maindata.contractUrl
        }
        self.form.contractname = maindata.maincontent
        self.form.contractId = maindata.contractId
        self.form.agreementtype = maindata.agreementtype
        // 新合同信息
        self.form.newht = maindata.operationdata.htMainData
        if (maindata.operationdata.htMainData.jpqx === -1) {
          self.form.newht.jpqx = ''
        }
        self.form.newht.syfs = String(maindata.operationdata.htMainData.syfs)
        self.form.newht.czkzkjs = String(maindata.operationdata.htMainData.czkzkjs)
        self.form.newht.contractcode = maindata.operationdata.htMainData.htcode
        self.form.newht.hsfs = maindata.operationdata.htMainData.hsfs
        self.form.oldht.hsfs = self.form.newht.hsfs
        self.form.oldht = maindata.operationdata.oldHtMainData
        self.form.oldht.contractcode = maindata.operationdata.oldHtMainData.htcode
        self.form.oldht.startdate = maindata.operationdata.oldHtMainData.startDateStr
        self.form.oldht.enddate = maindata.operationdata.oldHtMainData.endDateStr
        /* if (self.form.oldht.contractcode !== '') {
          this.queryoldhtAndClone()
        }*/
        // 列表赋值
        self.form.datedetails = maindata.operationdata.dateDetails
        self.form.ccdetails = maindata.operationdata.ccDetails
        self.form.fjcolumns = maindata.operationdata.fjcolumns
        self.form.fjdata = maindata.operationdata.fjdata
        self.form.kkdata.columnlist = maindata.operationdata.kkcolumns
        self.form.kkdata.datalist = maindata.operationdata.kkdata
        // 所有日期重新赋值
        self.form.newht.startdate = maindata.operationdata.htMainData.startDateStr
        self.form.newht.enddate = maindata.operationdata.htMainData.endDateStr
        self.form.newht.deptname = maindata.operationdata.htMainData.deptname
        self.form.newht.deptid = maindata.operationdata.htMainData.deptid
        self.form.ccdetails.startDate = maindata.operationdata.dateDetails.startDateStr
        self.form.ccdetails.endDate = maindata.operationdata.dateDetails.endDateStr

        // 状态判断
        if (maindata.status === 0) {
          // 将表单设置为只读
          this.cansave = true
          this.cansubmit = false
          this.canmodify = false
          this.canrevoke = true
          this.disableflag = false
          self.form.statusstr = '未提交'
        } else if (maindata.status === 1) {
          this.cansave = true
          this.cansubmit = true
          this.canmodify = true
          this.canrevoke = false
          this.disableflag = false
          self.form.statusstr = '流转中'
        } else if (maindata.status === 2) {
          this.cansave = true
          this.cansubmit = true
          this.canmodify = true
          this.canrevoke = true
          this.disableflag = true
          self.form.statusstr = '签核完成'
        } else if (maindata.status === 3) {
          // 将表单设置为只读
          this.cansave = true
          this.cansubmit = true
          this.canmodify = false
          this.canrevoke = true
          this.disableflag = false
          self.form.statusstr = '驳回'
        } else if (maindata.status === 4) {
          // 将表单设置为只读
          this.cansave = true
          this.cansubmit = true
          this.canmodify = false
          this.canrevoke = true
          this.disableflag = false
          self.form.statusstr = '撤销流程'
        } else if (maindata.status === 5) {
          this.cansave = true
          this.canmodify = true
          this.cansubmit = true
          this.canrevoke = true
          this.disableflag = true
          self.form.statusstr = '作废'
        }
      })
    },
    //  获取表单数据并初始化参数
    handleCopy(query) {
      const self = this
      self.form.code = query.formcode
      self.api.operationFormData(self.form).then(res => {
        const maindata = res.data
        const oldmaindata = JSON.parse(JSON.stringify(res.data.operationdata.htMainData))
        // 确保 oldht 和 newht 完全独立
        self.form.oldht = oldmaindata
        self.form.newht = maindata.operationdata.htMainData
        self.form.copycode = oldmaindata.code
        self.form.code = ''
        self.form.typename = maindata.typename
        self.form.operationtype = maindata.operationtype
        if (maindata.ifcontract) {
          self.form.ifcontract = '是'
          self.form.sequence = maindata.sequence
          self.form.sealtype = maindata.sealtype
        } else {
          self.form.ifcontract = '否'
        }
        self.form.contractname = maindata.maincontent
        self.form.contractId = maindata.contractId
        self.form.agreementtype = maindata.agreementtype
        self.form.contractUrl = ''
        // 所有日期重新赋值并分解期限
        self.form.newht.startdate = query.startdate
        self.form.newht.enddate = query.enddate
        this.getcopyhtdatedetails()
        if (maindata.operationdata.htMainData.jpqx === -1) {
          self.form.newht.jpqx = ''
        }
        self.form.newht.syfs = String(maindata.operationdata.htMainData.syfs)
        self.form.newht.czkzkjs = String(maindata.operationdata.htMainData.czkzkjs)
        self.form.newht.contractcode = maindata.operationdata.htMainData.htcode
        self.form.newht.hsfs = maindata.operationdata.htMainData.hsfs
        self.form.oldht.hsfs = maindata.operationdata.htMainData.hsfs
        // self.form.oldht = oldmaindata
        self.form.oldht.contractcode = oldmaindata.htcode
        self.form.oldht.startdate = oldmaindata.startDateStr
        self.form.oldht.enddate = oldmaindata.endDateStr
        // 列表赋值
        // self.form.ccdetails = maindata.operationdata.ccDetails
        // self.form.fjcolumns = maindata.operationdata.fjcolumns
        // self.form.fjdata = maindata.operationdata.fjdata
        // self.form.kkdata.columnlist = maindata.operationdata.kkcolumns
        // self.form.kkdata.datalist = maindata.operationdata.kkdata

        self.form.newht.deptname = maindata.operationdata.htMainData.deptname
        self.form.newht.deptid = maindata.operationdata.htMainData.deptid
        // self.form.ccdetails.startDate = maindata.operationdata.dateDetails.startDateStr
        // self.form.ccdetails.endDate = maindata.operationdata.dateDetails.endDateStr
      })
    },
    // 放入扣款数据
    copydeductdetails() {
      const self = this

      // 查询列表数据
      self.api.deductionlistbychoosetype('自选').then(res => {
        // 获取列表数据
        self.kkListData = res.data
        // 关闭加载状态
        setTimeout(() => {
          self.listLoading = false
        }, 0.5 * 1000)
      })
    },
    // 修改专柜人数 则扣款费用自动计算
    changezgrs() {
      const self = this
      // 遍历 kkdata.datalist 数组
      for (let i = 0; i < self.form.kkdata.datalist.length; i++) {
        const row = self.form.kkdata.datalist[i]
        // 如果费用项目是"人员培训费"
        if (row.kkfy === '人员培训费') {
          for (let m = 0; m < self.form.kkdata.columnlist.length; m++) {
            const kk = self.form.kkdata.columnlist[m].label
            if (kk !== '原合约') {
              // 获取单价
              const dj = row[kk].dj
              // 更新费用
              row[kk].fy = dj * self.form.newht.zgrs
            }
          }
        }
      }
    },
    // 修改面积
    changearea() {
      const self = this
      // 遍历 kkdata.datalist 数组
      for (let i = 0; i < self.form.kkdata.datalist.length; i++) {
        const row = self.form.kkdata.datalist[i]
        // 如果费用项目是"人员培训费"
        if (row.kkfy === '物业管理费') {
          for (let m = 0; m < self.form.kkdata.columnlist.length; m++) {
            const kk = self.form.kkdata.columnlist[m].label
            if (kk !== '原合约') {
              // 获取单价
              const dj = row[kk].dj
              // 更新费用
              row[kk].fy = dj * self.form.newht.area
            }
          }
        }
      }
    },
    // 输入关键字
    zgkeyWordChange() {
      const self = this
      // 表格用原表格的数据 即 用于搜索的总数据
      // self.fcInfoData = self.searchfcInfoData
      const _search = self.zgkeyWord
      const newListData = [] // 用于存放搜索出来数据的新数组
      if (self.zgkeyWord !== '') {
        // filter 过滤数组
        this.searchZgData.filter((item) => {
          // newListData中 没有查询的内容，就添加到newListData中
          if (
            item.deptid.indexOf(_search) !== -1 ||
            item.dept_name.indexOf(_search) !== -1
          ) {
            newListData.push(item)
          }
        })
        this.zgdata = newListData
      } else {
        self.zgdata = self.searchZgData
      }
    },
    // 打开扣款选择框
    handleKkTable() {
      const self = this
      // 查询列表数据
      self.api.deductionlistbychoosetype('自选').then(res => {
        // 获取列表数据
        self.kkListData = res.data
        // 关闭加载状态
        setTimeout(() => {
          self.listLoading = false
        }, 0.5 * 1000)
      })
      self.kkListable = true
    },
    // 将选择的扣款加入集合
    getDeduct(row) {
      const self = this
      const newData = {
        kkfy: row.remark ? `${row.deductname}(${row.remark})` : row.deductname,
        kkfycode: row.id,
        ifunit: row.ifunit,
        datatype: row.datatype,
        candelete: true
      }
      this.form.kkdata.columnlist.forEach(column => {
        if (row.ifunit === '是') {
          self.kkfyList.push(row.kkfy)
          newData[column.prop] = {
            dj: '0',
            fy: '0'
          }
          newData.djdw = row.djunit
          newData.fydw = row.fyunit
        } else {
          newData[column.prop] = '0'
        }
      })
      // 将 data 添加到 datalist 数组
      this.form.kkdata.datalist.push(newData)
      this.kkListable = false
    },
    // 删除选中扣款行
    handleDeleteKk(row) {
      const index = this.form.kkdata.datalist.indexOf(row)
      if (index !== -1) {
        this.form.kkdata.datalist.splice(index, 1)
      }
    },
    // 重新生成合同按钮权限
    ifcancontractagain(nickname) {
      const strList = ['牟婧瑶', '江丽', '唐小红', '印秋燕', '朱玉婷', '黄晨', '冷静']
      if (strList.includes(nickname)) {
        return true
      } else {
        return false
      }
    },
    // 重新生成合同
    contractagain() {
      const self = this
      self.api.operationagain(self.form).then(res => {
        if (res.data === 'success') {
          self.$message.success('重新生成合同成功！')
        } else {
          self.$message.error('重新生成合同失败，请联系管理员')
        }
      })
    },
    // 收益方式如果是两者取其高新 则清算标记全标记
    handleSyfs() {
      const self = this
      if (self.form.fjdata.length > 0) {
        if (self.form.newht.syfs !== '0') {
          for (let x = 0; x < self.form.fjdata.length; x++) {
            self.form.fjdata[x].clearing = true
          }
        } else {
          for (let x = 0; x < self.form.fjdata.length; x++) {
            self.form.fjdata[x].clearing = false
            this.$alert('收益方式已改变，请手动勾选清算标记', '提示', {
              confirmButtonText: '确定'
            })
          }
        }
      }
    },
    // 打开合同浏览链接
    openContract(url) {
      window.open(url)
    },
    // 下载合同文档
    downloadContract() {
      const self = this
      this.dataapi.download(self.form.code)
    }
  }
}
</script>

<style scoped>
.contractCheckBox {
  padding-bottom: 5px;
  border-bottom: 1px solid #c0c4cc;
}
.contractCheckBox .el-form-item{
  margin-bottom:3px;
}
.contractCheckBox .el-form-item--small .el-form-item{
  margin-bottom:3px;
}

.demo_warp .tab_tit {
  display: flex;
  flex: 1;
  margin:.2rem;
}
.demo_warp .active {
  color: #a13e0d;
  background-color: cadetblue;
}
.demo_warp ul li {
  list-style: none;
  width: 49%;
  text-align: center;
  background-color: #ccc;
  margin:0 0.5%;
}
.demo_warp .tab_con {
  width: 100%;
  text-align: center;
}
.linkeytableHT{
  border-collapse:collapse;
  text-align:left;
  margin-top:15px;
  width:100%;
}
.linkeytableHT tr td{
  border:#CCCCCC 1px solid;
  padding-top:5px;
  padding-bottom:5px;
  padding-left:5px;
  padding-right:5px;
}
::v-deep input[disabled],input:disabled,input.disabled {
  color:#000000 !important;

}
::v-deep textarea[disabled],textarea:disabled,textarea.disabled {
  color:#000000 !important;
  background-color:#f1f1f1 !important;
}
</style>
